<template>
  <div class="screen-button fy-flex fy-flex__center">
    <img v-if="type == 0" src="../../assets/screen/icon_data.png"/>
    <p class="fy-btn" v-if="type == 0">数据分析</p>
    <img v-if="type == 1" src="../../assets/screen/icon_sos.png"/>
    <p class="fy-btn" v-if="type == 1">应急救援</p>
  </div>
</template>

<script>
export default {
  // 全局感知
  name: "",

  // 模板依赖
  components: {},
  filters: {},

  // 接口
  props: {
    type: String
  },

  // 本地状态
  data() {
    return {};
  },
  computed: {},
  // 事件
  watch: {},
  beforeCreate() {},
  created() {},
  beforeMount() {},
  mounted() {},
  beforeUpdate() {},
  updated() {},
  beforeDestroy() {},
  destroyed() {},
  // 非响应式的属性
  methods: {}
};
</script>

<style lang="scss" scoped>
.screen-button {
  margin-right: 1rem;
  width: 11rem;
  height: 3.5rem;

  cursor: pointer;
  background-image: url(../../assets/screen/bg_btn01.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  &:hover {
    opacity: 0.7;
  }
  &:active {
    opacity: 0.9;
  }
  img {
    width: 1.5rem;
    margin-right: 0.5rem;
  }
  p {
    color: #00fbff;
    font-size: 2rem;
  }
}
</style>
